<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>小米商城 - Xiaomi 15、REDMI K80、MIX Fold 4，小米电视官方网站</title>
  <link rel="stylesheet" href="./css/root.css">
  <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <div class="main-contenter">
        <div class="top-nav">
            <div class="left-box">
                <div><a href="">小米官网</a></div>
                <div><a href="">小米商城</a></div>
                <div><a href="">小米澎湃OS</a></div>
                <div><a href="">小米汽车</a></div>
                <div><a href="">云服务</a></div>
                <div><a href="">IoT</a></div>
                <div><a href="">有品</a></div>
                <div><a href="">小爱开放平台</a></div>
                <div><a href="">资质证照</a></div>
                <div><a href="">协议规则</a></div>
                <div class="stri"><a href="">
                    下载app</a>
                    <div class="sub-box">
                        <img src="./img/erweima.jpg" alt="">
                        <div class="text">小米商城APP</div>
                    </div>
                </div>
                <div><a href="">Select Location</a></div>
            </div>
            <div class="right-box">
                <div class="login-box">
                    <div><a href="login.html">登录</a></div>
                    <div><a href="register.html">注册</a></div>
                    <div><a href="">消息通知</a></div>
                </div>
                <div class="cart-box">
                    <div class="icon"></div>
                    <div class="text">购物车(</div>
                    <div class="num">0</div>
                    <div class="text">)</div>
                    <div class="cart-text">购物车中还没有商品，赶紧选购吧</div>
                </div>
            </div>
        </div>
        <div class="main">
            <div class="second-nav">
                <div class="logo">
                    <img src="/img/logo-mi2.png" alt="">
                </div>
                <div class="nav-box">
                    <div class="nav-list">
                        <div><a href="">REDMI手机</a></div>
                        <div><a href="">电视</a></div>
                        <div><a href="">笔记本</a></div>
                        <div><a href="">平板</a></div>
                        <div><a href="">家电</a></div>
                        <div><a href="">路由器</a></div>
                        <div><a href="">服务中心</a></div>
                        <div><a href="">社区</a></div>
                    </div>
                    <div class="search">
                        <div class="my-input" type="text" contenteditable="true"></div>
                        <div class="iconsearch"></div>
                    </div>
                </div>
            </div>
            
            <div class="banner">
                <div class="left-banner">
                    <div>小米手机</div>
                    <div>电视</div>
                    <div>家电</div>
                    <div>笔记本 平板 显示器</div>
                    <div>出行 穿戴</div>
                    <div>耳机 音箱</div>
                    <div>健康 儿童</div>
                    <div>生活 箱包</div>
                    <div>智能 路由器</div>
                    <div>电源 配件</div>
                </div>
                <div class="right-banner">
                    <div class="btn l">&lt;</div>
                    <div class="banner-box">
                        <div style="--icon: url(../img/1.jpg)" class="banner-item active"></div>
                        <div style="--icon: url(../img/2.jpg)" class="banner-item"></div>
                        <div style="--icon: url(../img/3.jpg)" class="banner-item"></div>
                        <div style="--icon: url(../img/4.jpg)" class="banner-item"></div>
                        <div style="--icon: url(../img/5.jpg)" class="banner-item"></div>
                    </div>
                    <div class="btn r">&gt;</div>
                </div>
            </div>
            <div class="ad">
                <div class="left-ad">
                <div><img src="/img/时钟.png" alt="">保障服务</div>
                <div><img src="/img/企业.png" alt="">企业团购</div>
                <div><img src="/img/F码.png" alt="">F码通道</div>
                <div><img src="/img/米粉卡.png" alt="">米粉卡</div>
                <div><img src="/img/以旧换新.png" alt="">以旧换新</div>
                <div><img src="/img/话费充值.png" alt="">话费充值</div>
                </div>
                <div class="right-ad">
                    <div><img src="/img/ad1.png" alt=""></div>
                    <div><img src="/img/ad2.png" alt=""></div>
                    <div><img src="/img/ad3.png" alt=""></div>
                </div>
            </div>
        </div>
        <div class="shop-list">
            <div class="big-ad">
                <img src="/img/长图.jpg" alt="">
            </div>
            <div class="content">
                <!-- <div class="content-item">
                    <div class="content-top">
                        <div class="content-left-box">手机</div>
                        <div class="content-right-box">
                            <div>查看更多</div>
                        </div>
                    </div>
                    <div class="ct-img">
                        <div class="ct-left-img"></div>
                        <div class="ct-right-img">
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                            <div>
                                <img src="/img/手机1.png" alt="">
                                <div class="right-text">Xiaomi Pro</div>
                            </div>
                        </div>
                    </div>
                </div> -->
            </div>
            <div class="botton-img"></div>
        </div>
        <div class="botton">
            <div class="botton-all">
                <div class="botton-top">
                    <div>预约维修服务</div>
                    <div>7天无理由退货</div>
                    <div>15天免费换货</div>
                    <div>满60包邮</div>
                    <div>1100余家小米售后网点</div>
                </div>
                <div class="botton-second">
                    <div class="botton-second-left">
                        <ul>
                            <li>选购指南</li>
                            <li>手机</li>
                            <li>电视</li>
                            <li>笔记本</li>
                            <li>平板</li>
                            <li>穿戴</li>
                            <li>耳机</li>
                            <li>家电</li>
                            <li>路由器</li>
                            <li>音箱</li>
                            <li>配件</li>
                        </ul>
                        <ul>
                            <li>线下门店</li>
                            <li>小米之家</li>
                            <li>服务网点</li>
                            <li>授权体验店/专区</li>
                        </ul>
                        <ul>
                            <li>关于小米</li>
                            <li>了解小米</li>
                            <li>加入小米</li>
                            <li>投资者关系</li>
                            <li>ESG与可持续发展</li>
                            <li>廉洁举报</li>
                        </ul>
                        <ul>
                            <li>关注我们</li>
                            <li>新浪微博</li>
                            <li>官方微信</li>
                            <li>联系我们</li>
                            <li>公益基金会</li>
                        </ul>
                    </div>
                    <div class="botton-second-right">
                       <div class="number">950816</div>
                       <div class="time">8:00-18:00(仅收市话费)</div>
                        <div class="phone">人工客服</div>
                        <div class="number">950816</div>
                        <div class="time">8:00-18:00(仅收市话费)<br>
                            手机适用于:Xiaomi MIX Fold系列、MIX Flip系列、数字12系列及以上<br>
                            电视适用于:98寸、100寸电视
                        </div>
                        <div class="phone">人工客服</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="tool-list">
        <div class="tool-item">
            <div class="img"></div>
            <div class="text">手机APP</div>
        </div>
        <div class="tool-item">
            <div class="img"></div>
            <div class="text">个人中心</div>
        </div>
        <div class="tool-item">
            <div class="img"></div>
            <div class="text">售后服务</div>
        </div>
        <div class="tool-item">
            <div class="img"></div>
            <div class="text">人工客服</div>
        </div>
        <div class="tool-item">
            <div class="img"></div>
            <div class="text">购物车</div>
         <div class="tool-item">
            <div class="img"></div>
            <div class="text">回顶部</div>
        </div>
        </div>
    </div>
    <script src="./js/index.js"></script>
</body>
</html>